﻿@{
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1" />
    <meta http-equiv="X-UA-Compatible" content="IE=9" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
    <title>登录</title>
    <link href="/ui/css/bootstrap.min14ed.css" asp-append-version="true" rel="stylesheet">
    <link href="/ui/css/font-awesome.css" asp-append-version="true" rel="stylesheet">
    <link href="/ui/css/animate.css" asp-append-version="true" rel="stylesheet">
    <link href="/ui/js/plugins/layer/skin/layer.css" asp-append-version="true" rel="stylesheet" />
    <link href="/ui/css/style.css" asp-append-version="true" rel="stylesheet">
    <link href="/ui/css/common.css" asp-append-version="true" rel="stylesheet">
    <link href="/ui/css/login.css" asp-append-version="true" rel="stylesheet">
    <!--[if lt IE 9]>
    <meta http-equiv="refresh" content="0;/error/ie" />
    <![endif]-->
    <script>
        if (window.top !== window.self) { window.top.location = window.location };
    </script>
</head>
<body class="signin">
    <div class="signinpanel">
        <div class="row">
            <div class="col-sm-7">
                <div class="signin-info">
                    <div class="logopanel m-b">
                        <h1>[ MS ]</h1>
                    </div>
                    <div class="m-b"></div>
                    <h4>欢迎使用 <strong>MS BPM</strong></h4>
                    <ul class="m-b"></ul>
                </div>
            </div>
            <div class="col-sm-5">
                <div class="qrcode-tab">
                    <i class="fa fa-qrcode"></i>
                </div>
                <div class="qrcode-main" id="qrcode"></div>
                <noscript>
                    <div style="font-size:15px;margin-bottom:20px;">
                        您的浏览器未启用Javascript，无法进行登录。
                    </div>
                    <style>
                        form {
                            display: none;
                        }
                    </style>
                </noscript>
                <form>
                    <h4 class="no-margins">登录：</h4>
                    <p class="m-t-md">登录到后台</p>
                    <input type="text" class="form-control uname required" autocomplete="off" placeholder="用户名" name="username" value="wms" />
                    <input type="password" class="form-control pword m-b required" placeholder="密码" name="password" value="123" />
                    @*<input type="text" placeholder="验证码" class="form-control m-b required" name="validatecode" autocomplete="off" style="width: 70%;display: inline-block;margin: 0px;color: #666;" maxlength="4" />*@
                    @*<img src="/sys/user/ValidateCode" title="看不清？点击更换" onclick="this.src = this.src + '?'" style="vertical-align:middle;max-height: 30px;float: right;margin-top: 2px;cursor:pointer" />*@
                    @*<a>忘记密码了？</a>*@
                    <button type="button" class="btn btn-success btn-block">登录</button>
                </form>
                <div class="text-center red"></div>
            </div>
        </div>
        <div class="signup-footer">
            <div class="pull-left">
                &copy; @DateTime.Now.Year All Rights Reserved. wangmaosheng
            </div>
        </div>
    </div>
    <script src="/ui/js/jquery.min.js"></script>
    <script src="/ui/js/jquery-extension.js"></script>
    <script src="/lib/signalr/dist/browser/signalr.min.js"></script>
    <script src="/ui/js/plugins/polyfill/polyfill.min.js"></script>
    <script src="/ui/js/axios.min.js"></script>
    <script src="/ui/js/plugins/validate/jquery.validate.min.js"></script>
    <script src="/ui/js/plugins/validate/messages_zh.min.js"></script>
    <script src="/ui/js/plugins/layer/layer.min.js"></script>
    <script src="/ui/js/plugins/qrcode/qrcode.js"></script>
    <script>
        var code = $.getRandomGuid();;
        $(function () {
            var qrcode;
            var st;
            $('.qrcode-tab').on('click', function () {
                $(this).find('i').toggle();
                $('.qrcode-main').toggle();
                var display = $('.qrcode-main').css('display');
                if (display == 'none') {
                    qrcode.clear();
                    clearInterval(st);
                } else {
                    if (qrcode == undefined) {
                        qrcode = new QRCode("qrcode", {
                            width: 160,
                            height: 160,
                            colorDark: "#000000",
                            colorLight: "#ffffff",
                            correctLevel: QRCode.CorrectLevel.H
                        });
                        qrcode.makeCode("http://10.0.75.1:8000/Sys/User/ScanningLogin?code=" + code);
                    } else {
                        resetQrCode();
                    }
                    if (st != undefined) {
                        clearInterval(st)
                    }
                    st = setInterval(function () {
                        resetQrCode();
                    }, 10 * 1000);
                }
            })

            function resetQrCode() {
                qrcode.clear();
                code = loadQrCOde();
                qrcode.makeCode("http://10.0.75.1:8000/Sys/User/ScanningLogin?code=" + code);
            }


            $('.btn-success').click(function () {
                login();
            });
            document.onkeydown = function (event) {
                var e = event || window.event || arguments.callee.caller.arguments[0];
                if (e && e.keyCode == 13) {
                    login();
                }
            };
            function login() {
                if ($('form').valid() === false) {
                    return;
                }
                var model = {
                    username: $('input[name=username]').val(),
                    password: $('input[name=password]').val()
                };
                var layerindex = layer.load();
                axios.post('/Sys/User/Login', model).then(function (response) {
                    layer.close(layerindex);
                    if (response.status == 200) {
                        if (response.data == '' || response.data.LoginStatus == 1) {
                            location.href = '/';
                        } else {
                            $('div.text-center.red').text(response.data.Message);
                        }
                    }
                });
            }
        })

        const connection = new signalR.HubConnectionBuilder().withUrl("/scanningLoginHub").build();
        connection.start().then(function () {
            connection.invoke('InitMessage', code);
        }).catch(function (err) {
            return console.error(err.toString());
            });
        connection.on("HomePage", function (c) {
            location.href = "/Sys/User/Qr?code=" + c;
        });
        function loadQrCOde() {
            code = $.getRandomGuid();
            connection.invoke('InitMessage', code);
            return code;
        }
    </script>
</body>
</html>